<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1.0,maximum-scale=1.0, user-scalable=0">

		<title>订单管理</title>

		<link href="../AmazeUI-2.4.2/assets/css/admin.css" rel="stylesheet" type="text/css">
		<link href="../AmazeUI-2.4.2/assets/css/amazeui.css" rel="stylesheet" type="text/css">

		<link href="../css/personal.css" rel="stylesheet" type="text/css">
		<link href="../css/orstyle.css" rel="stylesheet" type="text/css">

		<script src="../AmazeUI-2.4.2/assets/js/jquery.min.js"></script>
		<script src="../AmazeUI-2.4.2/assets/js/amazeui.js"></script>
		<script type="text/javascript" src="../js/common.js"></script>
		<script type="text/javascript" src="../js/sweetalert2.all.js"></script>
	</head>

	<body>
		<!--头 -->
		<header>
			<article>
				<div class="mt-logo">
					<!--顶部导航条 -->
					<div class="am-container header">
						<ul class="message-l">
							<div class="topMessage">
								<div class="menu-hd" id="indexHeader">
								</div>
							</div>
						</ul>
						<ul class="message-r">
							<div class="topMessage home">
								<div class="menu-hd">
									<a href="index.html" target="_top" class="h">商城首页</a>
								</div>
							</div>
						</ul>
					</div>
					<div class="nav white">
					</div>

					<div class="clear"></div>
				</div>
				</div>
			</article>
		</header>
		<div class="nav-table">
			<div class="long-title"><span class="all-goods">个人中心</span></div>
			<div class="nav-cont">
				<ul>
				</ul>
			</div>
		</div>
		<b class="line"></b>
		<div class="center">
			<div class="col-main">
				<div class="main-wrap">

					<div class="user-order">

						<!--标题 -->
						<div class="am-cf am-padding">
							<div class="am-fl am-cf"><strong class="am-text-danger am-text-lg">订单管理</strong> / <small>Order</small></div>
						</div>
						<hr/>

						<div class="am-tabs am-tabs-d2 am-margin" data-am-tabs>

							<ul class="am-avg-sm-5 am-tabs-nav am-nav am-nav-tabs">
								<li class="am-active">
									<a href="#tab1">所有订单</a>
								</li>
								<li>
									<a href="#tab5">待评价</a>
								</li>
							</ul>

							<div class="am-tabs-bd">
								<div class="am-tab-panel am-fade am-in am-active" id="tab1">
									<div class="order-top">
										<div class="th th-item">
											<td class="td-inner">商品</td>
										</div>
										<div class="th th-price">
											<td class="td-inner">单价</td>
										</div>
										<div class="th th-number">
											<td class="td-inner">数量</td>
										</div>
										<div class="th th-operation">
											<td class="td-inner">商品操作</td>
										</div>
										<div class="th th-amount">
											<td class="td-inner">合计</td>
										</div>
										<div class="th th-status">
											<td class="td-inner">交易状态</td>
										</div>
										<div class="th th-change">
											<td class="td-inner">交易操作</td>
										</div>
									</div>

									<div class="order-main">
										<div class="order-list">
										</div>
									</div>
								</div>
								
								<div class="am-tab-panel am-fade" id="tab5">
									<div class="order-top">
										<div class="th th-item">
											<td class="td-inner">商品</td>
										</div>
										<div class="th th-price">
											<td class="td-inner">单价</td>
										</div>
										<div class="th th-number">
											<td class="td-inner">数量</td>
										</div>
										<div class="th th-operation">
											<td class="td-inner">商品操作</td>
										</div>
										<div class="th th-amount">
											<td class="td-inner">合计</td>
										</div>
										<div class="th th-status">
											<td class="td-inner">交易状态</td>
										</div>
										<div class="th th-change">
											<td class="td-inner">交易操作</td>
										</div>
									</div>

									<div class="order-main">
										<div class="order-list-finish">
										</div>

									</div>

								</div>
							</div>

						</div>
					</div>
				</div>
			</div>
			<!--侧边栏-->
			<aside class="menu">
				<ul>
					<li class="person active">
						<a href="pindex.html"><i class="am-icon-user"></i>个人中心</a>
					</li>
					<li class="person">
						<p><i class="am-icon-newspaper-o"></i>个人资料</p>
						<ul>
							<li>
								<a href="pinformation.html">个人信息</a>
							</li>
						</ul>
					</li>
					<li class="person">
						<p><i class="am-icon-balance-scale"></i>我的交易</p>
						<ul>
							<li>
								<a href="order.html">订单管理</a>
							</li>
						</ul>
					</li>
				</ul>
			</aside>
		</div>
		<script>
			$(function(){
				/*检验用户是否登录*/
				if (getCookie("username") == null || getCookie("userid") == null) {
                    window.location.href="login.html";
                    return;
			    }else{
			    	$("#indexHeader").append(`
                            <a href="#" target="_top" class="h">您好，${getCookie("username")}</a>
                            <a href="javascript:void(0);" onclick="clearCookie()">退出</a>`
                    );
			    }
			   var userid=getCookie("userid");
			   //个人订单
			   $.ajax({
				   	type:"get",
				   	url:"/orders/selectByBuyerid/"+userid,
				   	dataType: "json",
				   	success:function(result){
				   		for(var i=0;i<result.data.length;i++){
				   			var html3;
							if(result.data[i].status==0){
								html3=`<span onclick="gotoReceive(${result.data[i].id})">确认收货</span>`;
							}
							if(result.data[i].status==1){
								html3=`<span onclick="gotoReceive(${result.data[i].id})">确认收货</span>`;
							}
							if(result.data[i].status==2){
								html3=`<span onclick="commentOrder(${result.data[i].id})">评价</span>`;
							}
							if(result.data[i].status==3){
                                html3=`<span>交易完成</span>`;
                            }
							
				   			var html=`
				   			<div class="order-status5">
								<div class="order-title">
									<div class="dd-num">订单编号：<a href="javascript:;">${result.data[i].id}</a></div>
									<span>成交时间：${result.data[i].createTime}</span>
								</div>
								<div class="order-content">
									<div class="order-left-${i}">
										
									</div>
									<div class="order-right">
										<li class="td td-amount">
											<div class="item-amount">
												合计：${result.data[i].totalPrice}
											</div>
										</li>
										<div class="move-right">
											<li class="td td-status">
												<div class="item-status">
													<p class="Mystatus-${i}"></p>
												</div>
											</li>
											<li class="td td-change">
												<div id="operation-${i}" class="am-btn am-btn-danger anniu" >
													${html3}
												</div>
											</li>
										</div>
									</div>
								</div>
							</div>`;
							$(".order-list").append(html);
							if(result.data[i].status==2){
								$(".order-list-finish").append(html);
							}
							
							
							
							/*订单明细*/
							for(let j=0;j<result.data[i].orderdetails.length;j++){
								var orderDetail=result.data[i].orderdetails[j];
								//查询商品信息
								var goods;
								$.ajax({
					   				type:"get",
					   				url:"/goods/info/"+orderDetail.goodsid,
					   				async:false,
					   				success:function(result){
					   					goods=result.data;
					   				}
				   				});
								
								var html2=`
									<ul class="item-list">
										<li class="td td-item">
											<div class="item-pic">
												<a href="#" class="J_MakePoint">
													<img src="${goods.img1}" class="itempic J_ItemImg">
												</a>
											</div>
											<div class="item-info">
												<div class="item-basic-info">
													<a href="#">
														<p>${goods.goodsname}</p>
													</a>
												</div>
											</div>
										</li>
										<li class="td td-price">
											<div class="item-price">
												${goods.price}
											</div>
										</li>
										<li class="td td-number">
											<div class="item-number">
												<span>×</span>${orderDetail.goodsnum}
											</div>
										</li>
										<li class="td td-operation">
											<div class="item-operation">
												
											</div>
										</li>
									</ul>`;
								$(".order-left-"+i).append(html2);
							}
							
							if(result.data[i].status==0){
								$(".Mystatus-"+i).text("待发货");
								//$("#operation-"+i).append(`<span onclick="gotoReceive(${result.data[i].id})">确认收货</span>`);
							}
							if(result.data[i].status==1){
								$(".Mystatus-"+i).text("已发货");
								//$("#operation-"+i).append(`<span onclick="gotoReceive(${result.data[i].id})">确认收货</span>`);
							}
							if(result.data[i].status==2){
								$(".Mystatus-"+i).text("待评价");
								//$("#operation-"+i).append(`<span onclick="delOrder(${result.data[i].id})">删除订单</span>`);
							}
							if(result.data[i].status==3){
                                $(".Mystatus-"+i).text("已评价");
                            }
				   		}
				   	}
			   });
			})	
			
			/**
			 * 确认收货
			 */
			function gotoReceive(id){
				var d={"id":id,"status":2}
				$.ajax({
					type:"post",
					url:"/orders/update",
					data:JSON.stringify(d),
					async:true,
					contentType:"application/json; charset=utf-8",
					success:function(result){
							if(result.resultCode == 200) {
								swal({
									title: '更新成功',
									type: 'success',
									showConfirmButton: false,
									timer: 1500
								}).then(
								    function () {
								        window.location.reload();
								    }
								);
								
							} else {
								swal({
									title: '抱歉，更新失败',
									type: 'error',
									showConfirmButton: false,
									timer: 1500
								})
							}
					}
				});
			}
			
			/**
			 * 删除订单
			 */
			function delOrder(id){
				$.ajax({
					type:"get",
					url:"/orders/delete/"+id,
					async:true,
					contentType:"application/json; charset=utf-8",
					success:function(result){
							if(result.resultCode == 200) {
								swal({
									title: '更新成功',
									type: 'success',
									showConfirmButton: false,
									timer: 1500
								}).then(
								    function (){
								        window.location.reload();
								    }
								);
								
							} else {
								swal({
									title: '抱歉，更新失败',
									type: 'error',
									showConfirmButton: false,
									timer: 1500
								})
							}
					}
				}); 
			}
			
			/**
			 * 去评价
			 */
			function commentOrder(orderid){
				window.location.href="commentlist.html?orderid="+orderid;
			}
		</script>
	</body>

</html>